<template>
  <div>
    <!-- 购物车列表 -->
    <table border="1">
      <tr>
        <td>名称</td>
        <td>单价</td>
        <td>数量</td>
        <td>小计</td>
        <td>操作</td>
      </tr>
      <tr v-for="(goods, index) in list" :key="index">
        <td>{{ goods.name }}</td>
        <td>{{ goods.price }}</td>
        <td>{{ goods.num }}</td>
        <td>{{ goods.num * goods.price }}</td>
        <td>
          <button @click="del(index)">del</button>
          <button @click="edit(index)">edit</button>
        </td>
      </tr>
    </table>
  </div>
</template>

<script>
export default {
  props: ["list"],
  data() {
      return {
          aa: 234234
      }
  },
  methods: {
    del(index) {
      // 要删除的商品
      this.$emit("del", index);
    },
    edit(goods) {
        // 编辑商品 需要打开弹窗 还需要商品信息
        this.$emit("edit", goods);
    }
  },
};
</script>

<style>
</style>